<template>
  <div id="box">
    <el-button type="success"
               size="mini"
               @click="toEmail">邮箱验证</el-button>
    <el-button type="success"
               size="mini"
               @click="toPwd">密码验证</el-button>

    <br><br>
    <div v-if="this.isVisible===1">
      邮箱：<p style="width:90%;display:inline"
                readonly="">&ensp;{{email}}
      <br><br>
      新密码：<el-input style="width:89%"
                v-model="newpwd"></el-input>
      <br><br>
      验证码：<el-input style="width:100px"
                v-model="codeNum"></el-input>
      <el-button type="primary"
                 id="codebtn"
                 @click="code">发送验证码</el-button>
      <div align="right"><br>
        <el-button type="success"
                   size="mini"
                   @click="cancel">取消</el-button>
        <el-button type="danger"
                   size="mini"
                   @click="commit1">确定</el-button>
      </div>
    </div>

    <div v-if="this.isVisible===2">
      旧密码：<el-input v-model="oldpwd"></el-input><br><br>
      新密码：<el-input v-model="newpwd"></el-input>
      <br><br>
      <div align="right">
        <el-button type="success"
                   size="mini"
                   @click="code">取消</el-button>
        <el-button type="danger"
                   size="mini"
                   @click="commit2">确定</el-button>
      </div>
    </div>
  </div>
</template>

<script>
import http from '../../../axios_config'

export default {
  props: {
    email: {}//用来接收父组件传过来的数据
  },
  //当组件创建完毕之后自动调用此方法
  mounted () {
    console.log("updatepwd组件创建完毕");
    console.log(this.email);
  },
  data () {
    return {
      isVisible: 1,
      oldpwd: "",
      newpwd: "",
      codeNum: "",
      can: 0,
      //重新发送时间（秒）
      time: 60,
    }
  },

  methods: {
    cancel () {
      //通知父组件关闭对话框
      this.$emit("closedialog", { result: true, data: {} });
    },
    //邮箱认证
    commit1 () {
      console.log("邮箱认证");
      if (this.email != "" && this.newpwd != "" && this.codeNum != "") {
        http.post("http://192.168.11.18:8080/user/updataByEmail", { email: this.email, password: this.newpwd, code: this.codeNum })
          .then(res => {
            if (res.data.state == "SUCCESS") {
              //   通知父组件关闭对话框
              this.$message(res.data.message);
              this.$emit("closedialog", { result: true, data: {} });
            } else {
              this.$message(res.data.message);
            }
          });
      } else {
        this.$message("请输入完整信息");
      }
    },
    //密码验证
    commit2 () {
      console.log("密码认证");
      console.log(this.oldpwd + this.newpwd);
      if (this.oldpwd != "" && this.newpwd != "") {
        let param = new URLSearchParams();
        param.append("oldpwd", this.oldpwd);
        param.append("newpwd", this.newpwd);
        http.post("http://192.168.11.18:8080/user/updatebypwd?", param)
          .then(res => {
            if (res.data.statusCode == 500) {
              this.$message("修改失败，请输入正确的密码");
            } else {
              this.$message("修改成功");
            }
          });
        //通知父组件关闭对话框
        this.$emit("closedialog", { result: true, data: {} });
      } else {
        this.$message("修改失败，请输入完整信息");
      }

    },
    //邮箱验证
    toEmail () {
      this.newpwd = "";
      this.isVisible = 1;
    },
    //密码验证
    toPwd () {
      this.newpwd = "";
      this.isVisible = 2;
    },
    code () {
      if (this.can == 0 && this.newpwd != "" && this.newpwd != null) {
        //可以按
        this.can = 1;
        http.post("http://192.168.11.18:8080/user/sendCode", { email: this.email, status: 2 }).then(res => {
          console.log(res);
          if (res.data.state == "SUCCESS") {
            this.change();
            let id = setTimeout(() => {
              this.can = 0;
              clearTimeout(id);
            }, this.time * 1000);
          } else {
            alert(res.data.message);
          }
        })
      } else if (this.newpwd == "" || this.newpwd == null) {
        alert("请先填写新密码！");
      }
    },
    change () {
      let times = this.time;
      let codebtn = document.getElementById("codebtn");
      codebtn.textContent = "重新发送（" + times + " s）";
      let id = setInterval(() => {
        if (times == 0) {
          codebtn.textContent = "发送验证码";
          clearInterval(id);
        } else {
          times = times - 1;
          codebtn.textContent = "重新发送（ " + times + "  s）";
        }
      }, 1000);
    },
  }
}
</script>

<style scoped>
</style>